<template>
  <div class="bubble-menu-text">
    <Bold :hide-text="true" />
    <Italic :hide-text="true" />
    <Underline :hide-text="true" />
    <Strike :hide-text="true" />
    <TextColor :hide-text="true" />
    <Highlight :hide-text="true" />
    <Link :hide-text="true" />
  </div>
</template>

<script setup lang="ts">
import Bold from "../../toolbar/base/Bold.vue";
import Italic from "../../toolbar/base/Italic.vue";
import Underline from "../../toolbar/base/Underline.vue";
import Strike from "../../toolbar/base/Strike.vue";
import TextColor from "../../toolbar/base/TextColor.vue";
import Highlight from "../../toolbar/base/Highlight.vue";
import Link from "../../toolbar/base/Link.vue";

defineOptions({
  name: "TextBubbleMenu",
});
</script>

<style lang="scss" scoped>
.bubble-menu-text {
  display: flex;
  align-items: center;
  gap: 0;
  position: relative;
  z-index: 10000;
  pointer-events: auto;
}
</style>
